@charset "utf-8";
@import "reset";
@function widthset($w){
    @return ($w/1200*100%);
}

body{
    min-width: 1200px;
}

.web{
    width: widthset(1200);
}

//header{
//  width: widthset(752);
//  background: white;
//  margin: 0 auto;
//  margin-bottom: 35px;
//  overflow: hidden;
//  min-width: 1200px;
//  
//  .logo{
//      width: widthset(294);
//      padding-top: 23px;
//      margin-left: 2%;
//      
//      >a{
//          display: block;
//          width: 100%;
//          
//          img{
//              width: 100%;
//          }
//      }
//  }
//  .logo+div{
//      padding-top: 17px;
//      margin-right: 2%;
//      
//      .find{
//          height: 38px;
//          margin-left: 52%;
//          
//          .form{
//              width: 282px;
//              height: 100%;
//              text-align: right;
//              border: 1px solid #C6C6C6;
//              border-radius: 30px;
//              
//              form{
//                  height: 100%;
//                  text-align: left;
//                  position: relative;
//                  
//                  .sousuo{
//                      border: none;
//                      width: 78%;
//                      height: 100%;
//                      margin-left: 15px;
//                      margin-right: 5px;
//                  }
//                  input[type="submit"]{
//                      width: 24px;
//                      height: 24px;
//                      cursor: pointer;
//                      position: absolute;
//                      top: 6px;
//                      background: transparent;
//                  }
//                  i{
//                      font-size: 24px;
//                      color: #c4c4c4;
//                      position: absolute;
//                      top: 5px;
//                      cursor: pointer;
//                  }
//              }
//          }
//          >span{
//              float: right;
//              margin-top: -32px;
//              
//              >a{
//                  color: #004098;
//                  margin: 5px;
//              }
//              >a:last-of-type{
//                  margin-right: 0;
//              }
//          }
//      }
//      .nav{
//          margin-top: 19px;
//          
//          .navUl{
//              overflow: hidden;
//              
//              >li{
//                  float: left;
//                  margin-left: 38px;
//                  
//                  a{
//                      font-size: 18px;
//                      color: #004098;
//                  }
//              }
//          }
//      }
//  }
//}
//
//.banner{
//  font-size: 0;
//  >img{
//      width: widthset(1200);
//  }
//}
//
//footer{
//  width: 100%;
//
//  .footTop{
//      overflow: hidden;
//      width: 100%;
//      background: #010101;
//      padding-bottom: 70px;
//      
//      .foottop{
//          width: 82%;
//          margin: 0 auto;
//      }
//      .topLeft{
//          width: 68%;
//          padding-top: 114px;
//          overflow: hidden;
//          
//          >ul{
//              float: left;
//              width: 13%;
//              margin-right: 3%;
//              
//              >li{
//                  margin-bottom: 28px;
//                  >a{
//                      font-size: 14px;
//                      color: #fff;
//                  }
//              }
//              >li:first-of-type{
//                  font-size: 18px;
//                  color: #20B5ED;
//                  font-weight: bold;
//              }
//          }
//      }
//      
//      .erweima{
//          width: widthset(170);
//          padding-top: 110px;
//          margin-left: width(30);
//          display: inline-block;
//          
//          img{
//              width: 100%;
//          }
//          p{
//              color: #FFFFFF;
//              text-align: center;
//              font-size: 14px;
//              margin-top: 8px;
//          }
//      }
//      .erweima:last-of-type{
//          margin-right: 0;
//      }
//  }
//  .footBottom{
//      width: 100%;
//      background: #004098;
//      position: relative;
//      
//      .footImg{
//          position: absolute;
//          top: 0;
//          left: 50%;
//          transform: translate(-50%, -50%);
//      }
//      .bottomCenter{
//          padding-top: 40px;
//          padding-bottom: 8px;
//          text-align: center;
//          
//          p{
//              font-size: 8px;
//              display: inline-block;
//              margin-right: 115px;
//              color: white;
//              
//              >span{
//                  margin: 0 4px;
//              }
//          }
//          p:last-of-type{
//              margin-right: 0;
//              position: relative;
//              
//              >img{
//                  position: absolute;
//                  right: -55px;
//                  top: -2px;
//              }
//          }
//      }
//  }
//}

//动画效果
@-webkit-keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

@keyframes jello {
  from,
  11.1%,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}
@-webkit-keyframes rise {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes rise {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@-webkit-keyframes bounceInRight {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-40px, 0, 0);
        transform: translate3d(-40px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes bounceInRight {
    from,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }
    from {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0);
        transform: translate3d(3000px, 0, 0);
    }
    60% {
        opacity: 1;
        -webkit-transform: translate3d(-40px, 0, 0);
        transform: translate3d(-40px, 0, 0);
    }
    75% {
        -webkit-transform: translate3d(20px, 0, 0);
        transform: translate3d(20px, 0, 0);
    }
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes rollIn {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, -120deg);
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes jackInTheBox {
    from {
        opacity: 0;
        -webkit-transform: scale(0.1) rotate(30deg);
        transform: scale(0.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg);
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes jackInTheBox {
    from {
        opacity: 0;
        -webkit-transform: scale(0.1) rotate(30deg);
        transform: scale(0.1) rotate(30deg);
        -webkit-transform-origin: center bottom;
        transform-origin: center bottom;
    }
    40% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg);
    }
    70% {
        -webkit-transform: rotate(3deg);
        transform: rotate(3deg);
    }
    to {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}
@-webkit-keyframes swing1 {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 15deg) translateY(-50%);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, -10deg) translateY(-50%);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 5deg) translateY(-50%);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, -5deg) translateY(-50%);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 0deg) translateY(-50%);
  }
}

@keyframes swing1 {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 15deg) translateY(-50%);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, -10deg) translateY(-50%);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 5deg) translateY(-50%);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, -5deg) translateY(-50%);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg) translateY(-50%);
    transform: rotate3d(0, 0, 1, 0deg) translateY(-50%); 
  }
}
@-webkit-keyframes swing2 {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing2 {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.navRight>ul>li>label {
    cursor: pointer;
}
.navRight>ul>li:hover{
    animation: jello 1s;
    color: #004098;
}

#model_content,
#platform_content,
#source_content,
#service_content,
#case_content {
    display: none;
    opacity: 0;
}

input[type="radio"] {
    display: none;
}

input[id="model"]:checked~.contentRight #nav_model {
    color: #004098;
}

input[id="platform"]:checked~.contentRight #nav_platform {
    color: #004098;
}

input[id="source"]:checked~.contentRight #nav_source {
    color: #004098;
}

input[id="service"]:checked~.contentRight #nav_service {
    color: #004098;
}

input[id="case"]:checked~.contentRight #nav_case {
    color: #004098;
}

input[id="model"]:checked~.contentRight #model_content {
    display: block;
    opacity: 1;
    animation: rise 5s;
}

input[id="platform"]:checked~.contentRight #platform_content {
    display: block;
    opacity: 1;
    animation: swing2 1.5s;
}

input[id="source"]:checked~.contentRight #source_content {
    display: block;
    opacity: 1;
    animation: bounceInRight 2s;
}

input[id="service"]:checked~.contentRight #service_content {
    display: block;
    opacity: 1;
    animation: jackInTheBox 2s;
}

input[id="case"]:checked~.contentRight #case_content {
    display: block;
    opacity: 1;
    animation: rollIn 1.5s;
}

.main{
    width: 84%;
    margin: 0 auto;
    position: relative;
    margin-bottom: 40px;
    
    .location{
        font-size: 0;
        margin-top: 18px;
        position: absolute;
        right: 0;
        
        i{
            color: #989898;
        }
        p{
            display: inline-block;
            font-size: 16px;
            margin-left: 8px;
            
            a{
                color: #989898;
            }
            span{
                margin-left: 8px;
                margin-right: 8px;
            }
        }
    }
    .content{
        overflow: hidden;

        .contentLeft{
            width: 17%;
            padding-top: 40px;
            
            .titleLeft{
                padding-bottom: 20px;
                padding-left: 10px;
                border-bottom: 2px solid #656565;
                
                p{
                    font-size: 16px;
                    line-height: 28px;
                    color: #666;
                }
                p:last-of-type{
                    font-size: 26px;
                    line-height: 40px;
                }
            }
            >ul>li{
                height: 60px;
                padding-left: 10px;
                border-bottom: 1px solid #E6E6E6;
                
                a{
                    color: #636363;
                    width: 100%;
                    height: 100%;
                    line-height: 60px;
                    display: inline-block;
                    vertical-align: middle;
                    position: relative;
                    font-size: 16px;
                    
                    >img{
                        position: absolute;
                        top: 20px;
                        right: widthset(130);
                        display: none;
                    }
                }
            }
            >ul>li:last-of-type>a>img{
                display: block;
            }
            >ul>li:hover{
                background: #7698d5;
            }
            >ul>li:hover>a{
                color: white;
            }
            >ul>li:hover>a>img{
                display: block;
            }
        }
        .border{
            width: 1px;
            height: 615px;
            background: #E6E6E6;
        }
        .contentRight{
            margin-top: 88px;
            margin-left: widthset(290);
            
            .navRight{
                ul{
                    overflow: hidden;
                    
                    >li{
                        float: left;
                        width: 20%;
                        text-align: center;
                    }
                }
            }
            .borderRight{
                height: 1px;
                width: 100%;
                background: #636363;
                margin-top: 19px;
                margin-bottom: 54px;
            }
            
//          雅卓优势-运营模式
            #model_content{
                img{
                    cursor: pointer;
                }
                img:hover{
                    transform: scale(1.2);
                    transition: transform, 0.5s;
                }
                .titleRight{
                    width: 88%;
                    margin: 0 auto;
                    margin-bottom: 65px;
                    
                    >div{
                        text-align: center;
                    }
                    >div:first-of-type{
                        margin-bottom: 15px;
                    }
                    >div:nth-of-type(2){
                        font-size: 24px;
                        margin-bottom: 22px;
                    }
                    >div:last-of-type{
                        width: 74px;
                        height: 6px;
                        margin: 0 auto;
                        background: #000;
                    }
                }
                
                .contentBlock{
                    text-align: center;
                    width: 100%;
                    position: relative;
                    padding-bottom: 80px;
                    
                    .blockCenter{
                        width: 100%;
                        
                        ul{
                            position: absolute;
                            left: 50%;
                            transform: translateX(-50%);
                            
                            >li{
                                width: 100%;
                                
                                >img{
                                    width: 100%;
                                }
                                >div{
                                    width: 1px;
                                    height: 72px;
                                    background: #8E8E8E;
                                    margin: 22px auto;
                                }
                            }
                        }
                    }
                    .blockLeftRight{
                        margin: 0 5%;
                        height: 222px;
                        
                        .blockLeft{
                            display: inline-block;
                            width: 38%;
                            text-align: right;
                            margin-top: 20px;
                            margin-left: -24%;
                            position: relative;
                            
                            >div{
                                width: 58px;
                                height: 5px;
                                background: black;
                                margin-top: 30px;
                                display: inline-block;
                                position: absolute;
                                bottom: -22px;
                                right: 0px;
                            }
                            >p{
                                font-size: 24px;
                                color: #2565BE;
                                margin-top: 10px;
                            }
                        }
                        .blockRight{
                            display: inline-block;
                            width: 38%;
                            text-align: left;
                            float: right;
                            margin-top: 34px;
                            position: relative;
                            
                            >p{
                                font-size: 24px;
                                color: #2565BE;
                                margin-top: 10px;
                            }
                            >div{
                                width: 58px;
                                height: 5px;
                                background: black;
                                margin-top: 30px;
                                display: inline-block;
                                position: absolute;
                                bottom: -22px;
                                left: 0px;
                            }
                        }
                    }
                }
                
                .contentBottom{
                    width: 100%;
                    position: relative;
                    
                    .block{
                        height: 1px;
                        width: 100%;
                        background: #929292;
                    }
                    .triangle{
                        height: 0;
                        width: 0;
                        border-top: 15px solid #929292;
                        border-left: 10px solid transparent;
                        border-right: 10px solid transparent;
                        position: absolute;
                        left: 50%;
                        transform: translate(-50%, -50%);
                    }
                    .bottomThree{
                        width: 90%;
                        margin: 66px auto;
                        text-align: center;
                        
                        .conbottom{
                            width: 30%;
                            margin: 0 auto;
                            display: inline-block;
                            vertical-align: top;
                            
                            img{
                                margin-bottom: 38px;
                            }
                            p{
                                color: #666;
                                text-align: center;
                                line-height: 24px;
                            }
                        }
                    }
                }
            }
            
//          雅卓优势-雅卓平台
            #platform_content{
                img{
                    cursor: pointer;
                }
                img:hover{
                    transform: scale(1.2);
                    transition: transform, 0.5s;
                }
                
                .platform1{
                    width: 88%;
                    margin: 0 auto;
                    font-size: 0;
                    margin-bottom: 30px;
                    
                    .firstLeft{
                        display: inline-block;
                        width: 48%;
                        
                        .platformTitle{
                            width: 100%;
                            margin: 0 auto;
                            
                            >div{
                                text-align: center;
                            }
                            >div:first-of-type{
                                margin-bottom: 25px;
                            }
                            >div:nth-of-type(2){
                                margin-bottom: 30px;
                                font-size: 24px;
                                letter-spacing: 3px;
                                font-weight: bold;
                            }
                            >div:last-of-type{
                                position: relative;
                                
                                .p_block{
                                    width: 100%;
                                    height: 1px;
                                    margin: 0 auto;
                                    background: #89888F;
                                }
                                .p_circle{
                                    width: 24px;
                                    height: 24px;
                                    border-radius: 12px;
                                    background: #3C528B;
                                    position: absolute;
                                    left: 50%;
                                    transform: translate(-50%,-50%);
                                }
                            }
                        }
                        >p{
                            font-size: 12px;
                            color: #737373;
                            text-align: center;
                            margin-bottom: 30px;
                            
                            >span{
                                display: block;
                                margin-bottom: 10px;
                            }
                            >span:first-of-type{
                                color: #3C528B;
                            }
                        }
                        >p:first-of-type{
                            margin-top: 40px;
                        }
                    }
                    >img{
                        display: inline-block;
                        vertical-align: top;
                        width: 35.4%;
                        float: right;
                        margin-right: 10%;
                        margin-top: 4%;
                    }
                }
                .platformBlock{
                    position: relative;
                    margin-bottom: 10px;
                    
                    .block{
                        height: 1px;
                        width: 100%;
                        background: #929292;
                    }
                    .triangle{
                        height: 0;
                        width: 0;
                        border-top: 15px solid #929292;
                        border-left: 10px solid transparent;
                        border-right: 10px solid transparent;
                        position: absolute;
                        left: 50%;
                        transform: translate(-50%, -50%);
                    }
                }
                .platform2{
                    .titleRight{
                        width: 88%;
                        margin: 0 auto;
                        margin-bottom: 65px;
                        
                        >div{
                            text-align: center;
                        }
                        >div:first-of-type{
                            text-align: left;
                            margin-bottom: 15px;
                        }
                        >div:nth-of-type(2){
                            font-size: 24px;
                            margin-bottom: 22px;
                        }
                        >div:last-of-type{
                            width: 70px;
                            height: 6px;
                            margin: 0 auto;
                            background: #000;
                        }
                    }
                    .contentBlock{
                        text-align: center;
                        width: 100%;
                        position: relative;
                        padding-bottom: 30px;
                        
                        .blockCenter{
                            width: 100%;
                            
                            ul{
                                position: absolute;
                                left: 50%;
                                transform: translateX(-50%);
                                
                                >li{
                                    width: 100%;
                                    
                                    >img{
                                        width: 100%;
                                    }
                                    >div{
                                        width: 1px;
                                        height: 72px;
                                        background: #8E8E8E;
                                        margin: 22px auto;
                                    }
                                }
                            }
                        }
                        .blockLeftRight{
                            margin: 0 5%;
                            height: 222px;
                            
                            .blockLeft{
                                display: inline-block;
                                width: 43%;
                                text-align: right;
                                margin-top: 20px;
                                margin-left: -22%;
                                position: relative;
                                
                                >p{
                                    font-size: 14px;
                                    color: #707070;
                                    margin-top: 10px;
                                }
                                >p:first-of-type{
                                    font-size: 30px;
                                    color: #000;
                                }
                            }
                            .blockRight{
                                display: inline-block;
                                width: 40%;
                                text-align: left;
                                float: right;
                                margin-top: 34px;
                                position: relative;
                                
                                >p{
                                    font-size: 14px;
                                    color: #707070;
                                    margin-top: 10px;
                                }
                                >p:first-of-type{
                                    font-size: 30px;
                                    color: #000;
                                }
                            }
                        }
                    }
                }
                .platform3{
                    .titleRight{
                        width: 88%;
                        margin: 0 auto;
                        margin-bottom: 65px;
                        
                        >div{
                            text-align: center;
                        }
                        >div:first-of-type{
                            font-size: 24px;
                            margin-top: 30px;
                            margin-bottom: 22px;
                        }
                        >div:last-of-type{
                            width: 70px;
                            height: 6px;
                            margin: 0 auto;
                            background: #000;
                        }
                    }
                    .firstline{
                        text-align: center;
                        width: 100%;
                        
                        .thirdBlock{
                            display: inline-block;
                            width: 27%;
                            margin: 0 2%;
                            margin-bottom: 35px;
                            
                            img{
                                margin-bottom: 20px;
                            }
                            p{
                                text-align: center;
                                font-size: 14px;
                                color: #707070;
                                
                                >span{
                                    font-size: 24px;
                                    color: #3C528B;
                                }
                            }
                        }
                    }
                    
                }
                .platform4{
                    margin-top: 30px;
                    margin-bottom: 20px;
                    
                    .titleRight{
                        width: 88%;
                        margin: 0 auto;
                        margin-bottom: 65px;
                        
                        >div{
                            text-align: center;
                        }
                        >div:first-of-type{
                            margin-bottom: 15px;
                        }
                        >div:nth-of-type(2){
                            font-size: 24px;
                            margin-bottom: 22px;
                        }
                        >div:last-of-type{
                            width: 70px;
                            height: 6px;
                            margin: 0 auto;
                            background: #000;
                        }
                    }
                    .fourContent{
                        text-align: center;
                        
                        .fourBlock{
                            display: inline-block;
                            margin-bottom: 36px;
                            width: 23%;
                            
                            >img{
                                margin-bottom: 25px;
                            }
                            >p{
                                font-size: 16px;
                                color: #707070;
                                line-height: 24px;
                            }
                        }
                    }
                }
                .platform5{
                    
                    .titleRight{
                        width: 12%;
                        margin-bottom: 65px;
                        margin-left: 4%;
                        float: left;
                        
                        >div{
                            text-align: left;
                        }
                        >div:first-of-type{
                            font-size: 20px;
                            margin-top: 40px;
                            margin-bottom: 22px;
                        }
                        >div:last-of-type{
                            width: 70px;
                            height: 6px;
                            background: #000;
                        }
                    }
                    .fiveContent{
                        overflow: hidden;
                        
                        .fiveBlock{
                            float: left;
                            position: relative;
                            width: 80%;
                            
                            >img{
                                width: 32%;
                            }
                            >img:hover{
                                transform: none;
                            }
                            >div:first-of-type{
                                width: 18%;
                                height: 10px;
                                display: inline-block;
                                background: #CBCBC9;
                                position: absolute;
                                left: 23%;
                                top: 29%;
                            }
                            >.font{
                                display: inline-block;
                                position: absolute;
                                left: 47%;
                                top: 28%;
                                width: 40%;
                                
                                >p{
                                    font-size: 12px;
                                    color: #707070;
                                    margin-bottom: 4%;
                                }
                                >p:first-of-type{
                                    font-size: 18px;
                                    color: #3C528B;
                                    margin-bottom: 0;
                                }
                                >p:nth-of-type(2){
                                    margin: 5% 0;
                                }
                            }
                        }
                        .fiveBlock:first-of-type{
                            margin-left: 42%;
                            margin-top: 11%;
                            z-index: 3;
                        }
                        .fiveBlock:nth-of-type(2){
                            margin-left: 23%;
                            margin-top: -6%;
                            z-index: 2;
                        }
                        .fiveBlock:nth-of-type(3){
                            margin-left: 2%;
                            margin-top: -6%;
                            z-index: 1;
                        }
                        .borderBlock1{
                            width: 23%;
                            height: 380px;
                            float: left;
                            border-top: 12px solid #E6EDF3;
                            border-left: 17px solid #E6EDF3;
                            margin-top: -109%;
                            margin-left: 36%;
                        }
                        .borderBlock2{
                            width: 13%;
                            height: 200px;
                            float: left;
                            border-top: 12px solid #E6EDF3;
                            border-left: 17px solid #E6EDF3;
                            margin-left: 9%;
                            margin-top: -58%;
                        }
                    }
                }
                .douhao{
                    text-align: right;
                    margin-top: 20px;
                    margin-bottom: 30px;
                    
                    >img{
                    width: 4%;
                    }
                    >img:hover{
                        transform: none;
                    }
                }
            }
            
//          雅卓优势-雅卓资源
            #source_content{
                .source1,.source2{
                    .sourceTitle{
                        width: 88%;
                        margin-bottom: 65px;
                        
                        >div{
                            text-align: center;
                        }
                        >div:first-of-type{
                            margin-bottom: 15px;
                        }
                        >div:nth-of-type(2){
                            margin-bottom: 22px;
                            
                            >p{
                                color: #247996;
                                font-size: 24px;
                            }
                        }
                        >div:last-of-type{
                            width: 74px;
                            height: 6px;
                            margin: 0 auto;
                            background: #000;
                        }
                    }
                    .sourceContent{
                        ul{
                            margin-left: 16%;
                            overflow: hidden;
                            >li{
                                float: left;
                                width: 30%;
                                color: #707070;
                                margin-bottom: 50px;
                            }
                        }
                    }
                }
                .division{
                    width: 88%;
                    margin-top: 50px;
                    margin-bottom: 40px;
                    position: relative;
                    
                    .block{
                        height: 1px;
                        width: 100%;
                        background: #929292;
                    }
                    .triangle{
                        height: 0;
                        width: 0;
                        border-top: 15px solid #929292;
                        border-left: 10px solid transparent;
                        border-right: 10px solid transparent;
                        position: absolute;
                        left: 50%;
                        transform: translate(-50%, -50%);
                    }
                }
            }
            
//          雅卓优势-服务内容
            #service_content{
                img{
                    cursor: pointer;
                }
                img:hover{
                    transform: scale(1.2);
                    transition: transform 0.5s;
                }
                .serviceTitle{
                    width: 88%;
                    margin-bottom: 65px;
                    margin: 0 auto;
                    
                    >div{
                        text-align: center;
                    }
                    >div:first-of-type{
                        margin-bottom: 15px;
                    }
                    >div:nth-of-type(2){
                        font-size: 24px;
                        margin-bottom: 22px;
                    }
                    >div:last-of-type{
                        width: 74px;
                        height: 6px;
                        margin: 0 auto;
                        background: #000;
                    }
                }
                
                .service1{
                    .serviceContent1{
                        width: 88%;
                        padding-left: 20px;
                        font-size: 0;
                        margin: 0 auto;
                        
                        >p{
                            font-size: 14px;
                            color: #919191;
                            text-align: center;
                            margin-bottom: 55px;
                            margin-top: 60px;
                            
                            >span{
                                margin: 0 10px;
                            }
                        }
                        .serviceContent{
                            display: inline-block;
                            width: 25%;
                            font-size: 14px;
                            vertical-align: top;
                            overflow: hidden;
                            margin-bottom: 30px;
                            
                            >img{
                                width: 100%;
                            }
                            img:hover{
                                transform: scale(1.2);
                                width: 100%;
                                transition: transform 0.5s;
                            }
                            >p{
                                font-size: 12px;
                                color: #919191;
                                line-height: 22px;
                            }
                            >p:first-of-type{
                                font-size: 18px;
                                color: #222;
                                padding-bottom: 25px;
                                margin-bottom: 25px;
                                border-bottom: 1px solid #222;
                            }
                        }
                        .serviceText{
                            padding-left: widthset(25);
                            padding-right: widthset(35);
                            box-sizing: border-box;
                            padding-top: 30px;
                            padding-top: 1%;
                        }
                        .serviceImg{
                            margin-top: -5px;
                        }
                    }
                }
                .division{
                    width: 100%;
                    margin-top: 70px;
                    margin-bottom: 50px;
                    position: relative;
                    
                    .block{
                        height: 1px;
                        width: 100%;
                        background: #929292;
                    }
                    .triangle{
                        height: 0;
                        width: 0;
                        border-top: 15px solid #929292;
                        border-left: 10px solid transparent;
                        border-right: 10px solid transparent;
                        position: absolute;
                        left: 50%;
                        transform: translate(-50%, -50%);
                    }
                }
                .serviceTitle{
                    width: 88%;
                    margin-bottom: 25px;
                    margin: 0 auto;
                
                    >div{
                        text-align: center;
                    }
                    >div:first-of-type{
                        font-size: 24px;
                        margin-bottom: 22px;
                    }
                    >div:last-of-type{
                        width: 74px;
                        height: 6px;
                        margin: 0 auto;
                        background: #000;
                    }
                }
                .service2{
                    .serviceContent2{
                        width: 88%;
                        margin: 0 auto;
                        margin-top: 25px;
                        
                        >p{
                            text-align: center;
                            font-size: 12px;
                            color: #888;
                            width: 35%;
                            line-height: 24px;
                            margin: 0 auto;
                        }
                        >p:first-of-type{
                            font-size: 16px;
                            color: #004098;
                            margin-bottom: 18px;
                            font-weight: bold;
                        }
                        .serviceTriangle{
                            position: relative;
                            margin-top: 45px;
                            
                            .triangle{
                                height: 0;
                                width: 0;
                                border-top: 10px solid #929292;
                                border-left: 5px solid transparent;
                                border-right: 5px solid transparent;
                                position: absolute;
                                left: 50%;
                                transform: translate(-50%, -50%);
                            }
                        }
                        .serviceContent{
                            margin-top: 90px;
                            
                            .contentImg{
                                text-align: center;
                                position: relative;
                                
                                img{
                                    width: 22%;
                                    margin: 0 13%;
                                }
                                span{
                                    display: inline-block;
                                    position: absolute;
                                    top: 50%;
                                    left: 50%;
                                    transform: translate(-50%,-50%);
                                }
                            }
                            .contentText{
                                text-align: center;
                                
                                .contentText1, .contentText2{
                                    display: inline-block;
                                    vertical-align: top;
                                    width: 45%;
                                    margin-right: 2%;
                                    
                                    p{
                                        text-align: center;
                                        font-size: 12px;
                                        color: #888;
                                        line-height: 24px;
                                    }
                                    p:first-of-type{
                                        font-size: 16px;
                                        color: #004098;
                                        margin-top: 35px;
                                        margin-bottom: 40px;
                                        font-weight: bold;
                                    }
                                }
                                .contentText2{
                                    margin-left: 2%;
                                }
                            }
                        }
                    }
                }
                .service3{
                    margin-top: 75px;
                    
                    .serviceContent3{
                        text-align: center;
                        margin-top: 54px;
                        
                        .scBlock{
                            width: 22%;
                            display: inline-block;
                            vertical-align: top;
                            
                            img{
                                width: 100%;
                                margin-bottom: 34px;
                            }
                            >p{
                                text-align: center;
                                font-size: 12px;
                                color: #888;
                                line-height: 24px;
                                margin: 0 auto;
                            }
                            >p:first-of-type{
                                font-size: 16px;
                                color: #004098;
                                margin-bottom: 18px;
                                font-weight: bold;
                            }
                        }
                        .scBlock:nth-of-type(2){
                            margin: 0 11%;
                        }
                    }
                }
                .service4{
                    margin-top: 100px;
                    
                    .serviceContent4{
                        margin-top: 58px;
                        font-size: 0;
                        text-align: center;
                        margin-bottom: 30px;
                        
                        .fiveBlock{
                            display: inline-block;
                            width: 16%;
                            margin-right: 5%;
                            position: relative;
                            
                            img{
                                width: 100%;
                            }
                            p{
                                font-size: 26px;
                                position: absolute;
                                width: 95%;
                                top: 48%;
                                left: 50%;
                                transform: translateX(-50%);
                                letter-spacing: 3px;
                            }
                        }
                        .fiveBlock:last-of-type{
                            margin-right: 0;
                        }
                    }
                    
                }
            }
            
//          雅卓优势-成功案例
            #case_content{
                width: 90%;
                margin: 0 auto;
                
                img{
                    cursor: pointer;
                }
                .case1{
                    
                    .caseTitle{
                        p{
                            font-size: 30px;
                            margin-bottom: 28px;
                        }
                        >div{
                            width: 27px;
                            height: 2px;
                            background: #000;
                        }
                    }
                    .caseContent{
                        position: relative;
                        
                        .caseContent1, .caseContent2{
                            margin-top: 35px;
                            width: 48%;
                            
                            p{
                                font-size: 13px;
                                line-height: 28px;
                                color: #7C7C7C;
                            }
                            .contentTitle{
                                font-size: 18px;
                                line-height: 40px;
                                color: #212121;
                            }
                        }
                        >img{
                            position: absolute;
                            right: 10%;
                            top: 50%;
                            transform: translateY(-50%);
                            width: 30%;
                            margin-left: 11%;
                            vertical-align: top;
                        }
                        img:hover{
                            animation: swing1 1s;
                        }
                    }
                }
                .case2{
                    margin-top: 90px;
                    .caseTitle{
                        p{
                            font-size: 30px;
                            margin-bottom: 28px;
                        }
                        >div{
                            width: 27px;
                            height: 2px;
                            background: #000;
                        }
                    }
                    .caseContent{
                        
                        >img{
                            width: 40.5%;
                            margin-top: 24px;
                            vertical-align: top;
                        }
                        img:hover{
                            animation: swing2 1s;
                        }
                        .caseContent1{
                            width: 50%;
                            display: inline-block;
                            margin-left: 3%;
                            margin-top: 13px;
                            
                            p{
                                font-size: 13px;
                                line-height: 24px;
                                color: #7C7C7C;
                            }
                            .contentTitle{
                                font-size: 18px;
                                line-height: 40px;
                                color: #212121;
                            }
                        }
                        .caseContent2{
                            text-align: left;
                            margin-top: 30px;
                            
                            p{
                                display: inline-block;
                                font-size: 13px;
                                line-height: 24px;
                                color: #7C7C7C;
                                margin-right: 35px;
                            }
                        }
                    }
                }
            }
        }
    }
} 